<template>
  <div>
    <myheaders></myheaders>
    <br /><br />
    <!-- 面包屑导航 -->
    <Breadcrumb :datas="datas"></Breadcrumb>
    <section class="featured-block text-center">
      <div class="container"></div>
      图片标题：<input type="text" v-model="title" >
       <br><br >
      跳转链接：<input type="text" v-model="link" >
      <br><br >
      图片地址：<input type="text" v-model="img" >
      <br><br >
      <Button @click="update" color="green">确认修改</Button>
    </section>
    <myfooters></myfooters>
  </div>
</template>


 
<script>
// 导入头部组件
import myheader from "./myheader";
// 导入尾部组件
import myfooter from "./myfooter";

export default {
  data() {
    return {
      title: "",
      link: "",
      img: "",
      datas: [
        { title: "首页", route: { name: "index" } },
        { title: "修改幻灯片" }
      ]
    };
  },
  mounted: function() {},
  methods: {
    update: function() {
      if (this.title) {
        if (this.img) {
          this.axios({
            url: "http://localhost:8000/showpics/",
            method: "OPTIONS",
            data: {
              title: this.title,
              link: this.link,
              img: this.img,
              pid: this.$route.query.pid
            }
          }).then(res => {
            this.$Message(res.data.msg);
            this.$router.push("/picslist");
          });
        } else {
          this.$Message("请填写图片地址");
        }
      } else {
        this.$Message("请填写图片标题");
      }
    }
  },
  //   定义组件
  components: {
    myheaders: myheader,
    myfooters: myfooter
  }
};
</script>
 
<style>
</style>